//判断输入的账号的长度是否大于0 是：显示删除按钮 否则隐藏
//事件注册 input：输入事件 
$('#uesr-name').addEventListener('input', function() {
    if (this.value.length > 0) {
        $('.delete').style.display = 'block';
    } else {
        $('.delete').style.display = 'none';
    }
    // 如果输入框的值为空清除错误提示文字
    if (this.value === '') $('.accountTips').textContent = '';
})


//判断输入的密码的长度是否大于0 是：显示图标 否则隐藏
//事件注册
$('#pwd').addEventListener('input', function() {
    if (this.value.length > 0) {
        $('.delete2').style.display = 'block';
    } else {
        $('.delete2').style.display = 'none';
    }
    // 如果输入框的值为空清除错误提示文字
    if (this.value === '') $('.passwordTips').textContent = '';
})


//点击删除按钮时，清空输入框，并隐藏按钮
//事件注册
$('.delete').addEventListener('click', function() {
    $('#uesr-name').value = '';
    this.style.display = 'none';
    $('.accountTips').textContent = '';
})
$('.delete2').addEventListener('click', function() {
    $('#pwd').value = '';
    this.style.display = 'none';
    $('.passwordTips').textContent = '';
})


//失去焦点验证用户名是否合法，并给出相应提示
//定义变量保存验证用户名的正则表达式
let reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,20}$/;
//事件注册 blur
$('#uesr-name').addEventListener('blur', function() {
    // console.log(1);
    //判断输入的用户名是否合法
    let bool = reg.test(this.value); //test()检测字符串是否匹配某种格式
    bool ? $('.accountTips').textContent = '' : $('.accountTips').textContent = '用户名格式不正确';
})



//失去焦点验证密码是否合规，并给出相应提示
//定义变量保存验证密码的正则表达式
let regx = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$/;
//事件注册 blur
$('#pwd').addEventListener('blur', function() {
    // console.log(2);
    //判断输入的密码是否合规
    let bool = regx.test(this.value); //test()检测字符串是否匹配某种格式
    if (bool) {
        $('.passwordTips').textContent = '';
    } else {
        $('.passwordTips').textContent = '密码格式不正确';
    }
})


//点击登录按钮，验证用户名以及密码
//事件注册
$('.submitBtn').addEventListener('click', function() {
    // console.log(1);

    //提交只判断失败的情况，正确直接跳转
    if (!reg.test($('#uesr-name').value)) {
        //判断用户名情况
        $('.accountTips').textContent = '用户名格式不正确';
        return
    } else if (!regx.test($('#pwd').value)) {
        //判断密码情况
        $('.passwordTips').textContent = '密码格式不正确';
        return
    }
    location.href = '../home/home.html';
})


// tap选项卡
let li = $a('.tap-top-item');
let boxTap = $a('.tap-box');
// console.log(li);


li.forEach(function(value, index) {
    // console.log(value);

    // 事件注册 点击事件
    value.addEventListener('click', function() {
        li.forEach(function(v, i) {
                v.className = '';
                boxTap[i].style.display = 'none';
            })
            // 给菜单添加类名
        this.className = 'active';
        boxTap[index].style.display = 'block';
    })
})